// anselm feb 2007
// the idea here is to define a lightweight grammer with reusable parts
// it could be used for very sophisticated and efficient animation
// the main problem though is a lack of text support... (although i could fake it)
// it also has no picking capability or mouseover capability
// this whole idea may not fly

// the native terms for this grammer are namespace free; for import and export it should use owl schema profiles

 var type        = "type";
 var title       = "title";
 var link        = "link";
 var description = "description";
 var begins      = "begins";
 var ends        = "ends";
 var x           = "x";
 var y           = "y";
 var z           = "z";
 var t           = "t";
 var r           = "r";
 var q           = "q";
 var w           = "w";
 var width       = "width";
 var longitude   = "longitude";
 var latitude    = "latitude";
 var edgecolor   = "edgecolor";
 var fillcolor   = "fillcolor";
 var alpha       = "alpha";
 var id          = "id";

 var RED         = "#ff0000";
 var GREEN       = "#ff0000";

 // types

 var NOP         = "nop";
 var GROUP       = "group";
 var CHANNEL     = "channel";
 var ITEMS       = "items";
 var TRANSFORM   = "transform";
 var SWITCHER    = "switcher";

 var PIN         = "pin";
 var HINGE       = "hinge";

 var POINT       = "point";
 var LINE        = "line";
 var TRIANGLE    = "triangle";
 var BOX         = "box";
 var POLYGON     = "polygon";
 var VERTICES    = "vertices";
 var CVERTICES   = "cvertices";
 var NGON        = "ngon";
 var TRIANGLES   = "triangles";
 var QUADS       = "quads";
 var TRISTRIP    = "tristrip";
 var ROUNDBOX    = "roundbox";
 var CIRCLE      = "circle";
 var TEXT        = "text";
 var ARROW       = "arrow";
 var ARC         = "arc";
 var SPLINE      = "spline";

 var SLEEP       = "sleep";
 var LOOP        = "loop";

// test grammer

 var features = [
   type:GROUP,
   items: [
     { id:1, title:"my test point", type:POINT,    width:1, fillcolor: "#335577", alpha:0.7, vertices:[10,10,0], },
     { id:2, title:"my test point", type:LINE,     width:1, fillcolor: "#ff5500", alpha:0.7, vertices:[10,10,0,20,20,0]},
     { id:3, title:"my test point", type:TRIANGLE, width:1, fillcolor: "#ff0033", alpha:0.7, vertices:[0,0,0,10,0,0,0,10,0]},
     { id:4, title:"my test point", type:BOX,      width:1, fillcolor: "#ff00cc", alpha:0.7, vertices:[0,0,0,10,0,0,10,10,0,0,10,0]},
     { id:5, title:"my test point", type:POLYGON,  width:1, fillcolor: "#ffee00", alpha:0.7, vertices:[0,0,0,10,15,0,0,7,0,-5,3,0]},
     { id:6, title:"my test point", type:ARC,      width:1, fillcolor: "#ffee00", alpha:0.7, vertices:[0,0], begins:0.0, ends:4.23, r:30 },
   ];
 ];

// Features

function Paint_Point(c,f) {
  if( f.width )     c.lineWidth   = f.width;
  if( f.fillcolor ) c.fillStyle   = f.fillcolor;
  if( f.edgecolor ) c.strokeStyle = f.edgecolor;
  if( f.alpha )     c.globalAlpha = f.alpha;
  var v = f.vertices;
  var r = c.r;
  c.beginPath();
  c.arc(v[0],v[1],r,0,6.28318531,false);
  c.closePath();
  c.fill();
}

function Paint_Arc(c,f) {
  if( f.width )     c.lineWidth   = f.width;
  if( f.fillcolor ) c.fillStyle   = f.fillcolor;
  if( f.edgecolor ) c.strokeStyle = f.edgecolor;
  if( f.alpha )     c.globalAlpha = f.alpha;
  var v = f.vertices;
  var r = c.r;
  var begins = c.begins ? c.begins : 0;
  var ends = c.ends ? c.ends : 6.28318531;
  c.beginPath();
  c.arc(v[0],v[1],r,c.begins,c.ends,false);
  c.closePath();
  c.fill();
  c.stroke();
}

function Paint_Line(c,f) {
  if( f.width )     c.lineWidth   = f.width;
  if( f.fillcolor ) c.fillStyle   = f.fillcolor;
  if( f.edgecolor ) c.strokeStyle = f.edgecolor;
  if( f.alpha )     c.globalAlpha = f.alpha;
  v = f.vertices;
  c.beginPath();
  c.moveTo(v[0],v[1]);
  c.lineTo(v[3],v[4]);
  c.closePath();
  c.stroke();
}

function Paint_Rect(c,f) {
  if( f.width )     c.lineWidth   = f.width;
  if( f.fillcolor ) c.fillStyle   = f.fillcolor;
  if( f.edgecolor ) c.strokeStyle = f.edgecolor;
  if( f.alpha )     c.globalAlpha = f.alpha;
  v = f.vertices;
  c.fillRect(v[0],v[1],v[3]-v[0],v[4]-v[1]);
  c.stroke();
}

// factory of registered handlers

var paint_factory = { POINT:Paint_Point, CIRCLE:Paint_Arc, ARC:Paint_Arc, LINE:Paint_Line, RECT:Paint_Rect };

// Painter

Painter = function() {};

Painter.prototype = {
  parent:null,
  canvas:null,
  context:null,
  features:null,
  w:800,
  h:600,
  // init
  initialize: function(features) {
    this.features = features;
  },
  // wipe
  destroy: function() {
    if(canvas) {
      document.removeChild(canvas);
    }
  },
  // wipe
  update: function() {
    if(!this.canvas) {
      this.canvas = document.createElement("CANVAS");
      this.context = this.canvas.getContext("2d");
      if(this.map) {
        this.w = this.map.getSize().w;
        this.h = this.map.getSize().h;
      }
      this.canvas.setAttribute("width",this.w);
      this.canvas.setAttribute("height",this.h);
      if(this.parent) {
        this.parent.appendChild(this.canvas);
      } else {
        document.appendChild(this.canvas);
      }
    }
    this.context.clearRect(0,0,this.w,this.h);
    paint(this.features);
  },
  // paint all
  paint: function(node) {
  }
}
